<include file="public/layout" />
<style>
    ul.group-list {
        width: 96%;min-width: 1000px; margin: auto 5px;list-style: disc outside none;
    }
    .err{color:#F00; display:none;}
    ul.group-list li {
        white-space: nowrap;float: left;
        width: 150px; height: 25px;
        padding: 3px 5px;list-style-type: none;
        list-style-position: outside;border: 0px;margin: 0px;
    }
    .row .table-bordered td .btn,.row .table-bordered td img{
        vertical-align: middle;
    }
    .row .table-bordered td{
      padding: 8px;
      line-height: 1.42857143;
    }
    .table-bordered{
      width: 100%
    }
    .table-bordered tr td{
      border: 1px solid #f4f4f4;
    }
    .btn-success {
        color: #fff;background-color: #449d44;border-color: #398439 solid 1px;
    }
    .btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.col-xs-8 {
    width: 66.66666667%;
}
.col-xs-4 {
    width: 33.33333333%;
}
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    float: left;
}
.row .tab-pane h4{
  padding: 10px 0;
}
.row .tab-pane h4 input{
  vertical-align: middle;
} 
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}
.ncap-form-default .title{
  border-bottom: 0
}
.ncap-form-default dl.row, .ncap-form-all dd.opt{
    /*border-color: #F0F0F0;*/
    border: none;
}
.ncap-form-default dl.row:hover, .ncap-form-all dd.opt:hover{
    border: none;box-shadow: inherit;
}
.addprine{display: inline; }
.alisth{margin-top: 10px}
.p_plus strong{cursor: pointer;margin-left: 4px;}
.freight_template {
    font-size: 14px;
    display: inline-block;
    padding: 0px 10px;
}

</style>
<script src="__ROOT__/public/static/js/layer/laydate/laydate.js"></script>
<style type="text/css">
    html, body {
        overflow: visible;
    }
</style>

<body style="background-color: #FFF; overflow: auto;">
<div id="toolTipLayer" style="position: absolute; z-index: 9999; display: none; visibility: visible; left: 95px; top: 573px;"></div>
<div id="append_parent"></div>
<div id="ajaxwaitid"></div>
<div class="page">
    <div class="fixed-bar">
        <div class="item-title"><a class="back" href="javascript:history.back();" title="返回列表"><i class="fa fa-arrow-circle-o-left"></i></a>
            <div class="subject">
                <h3>添加定制模板的内容</h3>
            </div>
            <ul class="tab-base nc-row">
                <li><a href="javascript:void(0);" data-index='1' class="tab current"><span>通用信息</span></a></li>
                <li><a href="javascript:void(0);" data-index='2' class="tab"><span>商品模型</span></a></li>
                
            </ul>
        </div>
    </div>
    <form class="form-horizontal" id="handleposition" method="post">
        <input type="hidden" name="id" value="{$info.id}">
        <div class="ncap-form-default tab_div_1">
            <dl class="row">
                <dt class="tit">
                    <label><em>*</em>名称</label>
                </dt>
                <dd class="opt">
                    <input type="text" name="name" id="name" value="{$info.name}" class="input-txt">
                    <p class="notic">定制模板名称</p>
                </dd>
            </dl>
            <dl class="row">
                <dt class="tit">
                    <label for="store_name">简介</label>
                </dt>
                <dd class="opt">
                    <textarea rows="3" cols="80" name="message" class="input-txt">{$info.message}</textarea>
                    <span id="err_message" class="err" style="color:#F00; display:none;"></span>                    
                </dd>
            </dl> 

            <dl class="row">
                <dt class="tit">
                    <label><em>*</em>宣传图片</label>
                </dt>
                <dd class="opt">
                    <div class="input-file-show">
                        <span class="show">
                            <a id="img_a" target="_blank" class="nyroModal" rel="gal" href="{$info.icon}">
                            	<!--onmouseout=onclick="layer.closeAll();-->
                                <i id="img_i" class="fa fa-picture-o" onmouseover="layer.tips('<img src={$info.icon}>',this,{tips: [1, '#fff']});" onmouseout="layer.closeAll();"></i>
                                <!--<img id="img_i" src='{$info.icon}' style="width: 30px;height: 30px;" onmouseover="layer.tips('<img src={$info.icon}>',this,{tips: [1, '#fff']});" "></img>-->
                            </a>
                        </span>
           	            <span class="type-file-box">
                            <input type="text" id="icon" name="icon" value="{$info.icon}" class="type-file-text">
                            <input type="button" name="button" id="button1" value="选择上传..." class="type-file-button">
                            <input class="type-file-file" onClick="GetUploadify(1,'','custom','img_call_back')" size="30" hidefocus="true" nc_type="change_site_logo" title="点击前方预览图可查看大图，点击按钮选择文件并提交表单后上传生效">
                        </span>
                    </div>
                    <span class="err"></span>
                    <p class="notic">请上传图片格式文件</p>
                </dd>
            </dl>
			</div>
          
			<div class="ncap-form-default tab_div_2" style="display:none;">
		
				<div class="fbutton">       
			          
			          <div class="add" title="添加属性" >
			            <a onclick="addatt()"><span><i class="fa fa-plus"></i>添加属性</span></a>          
			          </div>
			          
		        </div> 
				
					
	            <dl class="row">
	                <div class="tab-pane" id="tab_goods_spec">
	                   
	                    <div class="row">
	                        <!-- ajax 返回规格-->
	                        <div id="ajax_spec_data" class="col-xs-10" ></div>
	                        <div id="" class="col-xs-10" >
	                            <table class="table table-bordered" id="goods_attr_table">
	                                <tr>
	                                    <td style="width: 150px;"><b>定制属性</b></td>
	                                    <td style="width: 150px;"><b>属性值(可不填)</b></td>
	                                    <td style="width: 150px;"><b>类型</b></td>
	                                    <td style="width: 150px;"><b>操作</b></td>
	                                </tr>
	                                
	                                <volist name="custom_att" id="item">                              	
	                                	<tr>
		                                    <td style="width: 150px;"><b><input name="att[]" value="{$item.attname}" /></b></td>
		                                    <td style="width: 150px;"><b><input name="attvalue[]" value="{$item.attvalue}" /></b></td>
		                                    <td style="width: 150px;"><b>
		                                    	<select name='atttype[]' id='atttype' >               
									            	<option value='1' <if condition="$item.atttype eq 1">selected</if>>文本</option>
									            	<option value='2' <if condition="$item.atttype eq 2">selected</if>>图片</option>
									          	</select>
		                                    </b></td>
		                                    <td style="width: 150px;" onclick="deleteatt(this)"><b> <a class="btn blue" ><i class="fa fa-trash-o"></i>删除</a></b></td>
		                                </tr>
				               		</volist> 
	                                
	                            </table>
	                        </div>
	                    </div>
	                </div>
	            </dl>             
		    </div> 
		    <div class="ncap-form-default">
            	<div class="bot"><a id="submit" class="ncap-btn-big ncap-btn-green">确认提交</a></div>
        	</div>
    </form>
</div>
<script type="text/javascript">
    $(function () {
        $(document).on("click", '#submit', function (e) {
            var type = parseInt($("#prom_type").val());
            var expression = $("[name='expression']").val();
            if (type == 3 && expression == 0){
                layer.msg('请选择优惠券',{icon:2});return false;
            }
            verifyForm();
        })
    });
    
    function verifyForm(){
    	
//  	console.log($('#handleposition').serialize());
//  	
//  	return; 
        $('span.err').hide();
        $.ajax({
            type: "POST",
            url: "{:U('Admin/Custom/editcustom')}",
            data: $('#handleposition').serialize(),
            async:false,
            dataType: "json",
            error: function () {
                layer.alert("服务器繁忙, 请联系管理员!");
            },
            success: function (data) {
                if (data.status == 1) {
                    layer.msg(data.msg, {
                        icon: 1,
                        time: 2000
                    }, function(){
                        location.href = "{:U('Admin/Custom/index')}";
                    });
                } else {
                	
                	var result = data.result;
                	var errormsg = '';
                	for(var key in result){
                		errormsg += result[key];
                	}
                	
                    layer.msg(data.msg+':'+errormsg, {icon: 2,time: 3000});
                    $.each(data.result, function (index, item) {
                        $('#err_' + index).text(item).show();
                    });
                }
            }
        });
    }

    function img_call_back(fileurl_tmp) {
        $("#icon").val(fileurl_tmp);
        $("#img_a").attr('href', fileurl_tmp);
        $("#img_i").attr('onmouseover', "layer.tips('<img src="+fileurl_tmp+">',this,{tips: [1, '#fff']});");
    }

    /** 以下 商品属性相关 js*/
    $(document).ready(function(){    
        //插件切换列表
        $('.tab-base').find('.tab').click(function(){
            $('.tab-base').find('.tab').each(function(){
                $(this).removeClass('current');
            });
            $(this).addClass('current');
			var tab_index = $(this).data('index');			
			$(".tab_div_1, .tab_div_2, .tab_div_3, .tab_div_4,.tab_div_5").hide();			
			$(".tab_div_"+tab_index).show();
		});		
            
    });
    
    	//删除属性
	function deleteatt(obj){
		$(obj).parent().remove();
	}
	
	//添加属性
	function addatt(){
    	var html = "<tr><td style='width: 150px;'><b><input name='att[]' value='' /></b></td>"+
	               		"<td style='width: 150px;'><b><input name='attvalue[]' value='' /></b></td>"+
	               		"<td style='width: 150px;'><b><select name='atttype[]'>"+                
				            "<option value='1'>文本</option>"+
				            "<option value='2'>图片</option>"+
				          "</select></b></td>"+
	               		"<td style='width: 150px;' onclick='deleteatt(this)'><b> <a class='btn blue' ><i class='fa fa-trash-o'></i>删除</a></b></td></tr>";
    	$('#goods_attr_table').append(html);
    }
</script>
</body>
</html>